<template>
  <div class="video-ecaluate">
    <course-ecaluatelist
      :ecaluatelist="ecaluatelist"
      v-if="!nolistshow"
    ></course-ecaluatelist>
    <div class="ecaluate_nolist"  v-if="nolistshow">
      <img src="../../assets/photo/no_list.png" class="ecaluate_nolist_photo" />
      <div class="ecaluate_nolist_text">竟然一条评价都没有</div>
    </div>
    <div class="video_ecaluate_tool flexcc" v-if="type !== 1">
      <div class="ecaluate_tool_btn flexcc" @click="govideoreviewer">评价</div>
    </div>
  </div>
</template>

<script>
import CourseEcaluatelist from '../video-course/course-ecaluatelist'
import API from '../../services/index'
export default {
	name: 'video-ecaluate',
	components: {
		CourseEcaluatelist,
	},
	data() {
		return {
			detailParams: {
				courseId: '',
			},
			type: '',
			ecaluatelist: [],
			nolistshow: false,
		}
	},
	computed: {},
	created() {
		this.detailParams.courseId = this.$route.params.courseId
		this.type = this.$route.params.type
		this.getcourseEvaluate()
	},
	mounted() {},
	methods: {
		govideoreviewer() {
			this.$router.push({
				name: 'VideoReviewer',
				params: { courseId: this.detailParams.courseId },
			})
		},
		async getcourseEvaluate() {
			const res = await API.getcourseEvaluateAjax({
				params: this.detailParams,
			})
			if (res.length === 0) {
				this.nolistshow = true
				console.log(1)
			}
			this.ecaluatelist = res
		},
	},
}
</script>

<style scoped lang="scss">
.video-ecaluate {
  width: 100%;
  padding-bottom: 71px !important;
}
.video_ecaluate_tool {
  width: 100%;
  height: 71px;
  background: #ffffff;
  box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.08);
  position: fixed;
  bottom: 0;
  left: 0;
  justify-content: center;
}
.ecaluate_tool_btn {
  width: 343px;
  height: 47px;
  background: linear-gradient(315deg, #0a73cf 0%, #108ee9 100%);
  border-radius: 4px;
  justify-content: center;
  font-size: 18px;
  line-height: 25px;
  color: #ffffff;
}
.ecaluate_nolist {
  width: 100%;
  box-sizing: border-box;
  padding: 121px 56px 0;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-flow: wrap row;
}
.ecaluate_nolist_photo {
  width: 100%;
  height: 179px;
}
.ecaluate_nolist_text {
  font-size: 15px;
  font-weight: normal;
  line-height: 23px;
  color: #999999;
  opacity: 1;
  margin-top: 5px;
}
</style>
